<template>
	<div class="useropinion">
		<div class="useropinionTitle">添加新地址</div>
		<div class="addnewaddress-text">
			<div><span>*收货人姓名：</span><input type="text" class="shouhuoname" id="shouhuoname"></div>
			<div class="suozaiaddress"><span>*所在地区：</span>
				<!-- <v-distpicker @selected="onSelected"></v-distpicker> -->
			</div>
			<div><span>*详细地址：</span><input type="text" class="shouhuoname" id="shouhuoaddress"></div>
			<div><span>*联系电环：</span><input type="text" class="adderphone shouhuoname"><span>或固定电话：</span><input type="text"
				class="gudingphone1 shouhuoname"><span class="and">-</span><input type="text" class="gudingphone2 shouhuoname"></div>
			<div><span> </span><input type="radio" class="radioipt">设置为常用地址</div>
			<div class="addernewsub" @click="addernewsub">保存</div>

		</div>
	</div>
</template>

<script>
	// import VDistpicker from 'v-distpicker'
	export default {
		components: {
			// VDistpicker
		},
		data() {
			return {adder:null}
		},
		methods: {
			onSelected(data) {
				this.adder=(data.province.value+ data.city.value+ data.area.value);
			},
			addernewsub(){
				var _this=this;
				var name=document.getElementById("shouhuoname").value;
				var street=document.getElementById("shouhuoaddress").value;
				var yidongphone=document.getElementsByClassName("adderphone")[0].value;
				var gudingphone1=document.getElementsByClassName("gudingphone1")[0].value;
				var gudingphone2=document.getElementsByClassName("gudingphone2")[0].value;
				var radioipt=document.getElementsByClassName("radioipt")[0].checked;
				var gudingphone=gudingphone1+gudingphone2;
				var phone=null;
				var userphone=localStorage.getItem("userphone");
				//手机号的确认
				if(yidongphone==''){
					phone=gudingphone
				}else if(gudingphone==''){
					phone=yidongphone
				}
				//是否为默认地址
				var state=null;
				if(radioipt){
					state=1;
				}else{
					state=2;
				}
				//判断点击之前是否输入完整的信息
				if(name==''){
					alert("请输入收货人的姓名")
				}else if(this.adder==''){
					alert("请选择所在地区")
				}else if(street==''){
					alert("请输入详细地址")
				}else if(phone==''&&(gudingphone1==''&gudingphone2=='')){
					alert("请输入手机号或者固定电话")
				}else{
					this.$axios.post("http://localhost:3000/userinfor/addaddress",{name:name,city:_this.adder,street:street,phone:phone,beizhu:'家里的地址',state:state,userphone:userphone})
					.then(function(response){
						var list=response.data;
						// window.console.log(response);
						if(list.code==200){
							window.history.back(-1)
						}
					}).catch(function (error) {
						window.console.log(error);
					})
				}
				
			}
		},
	}
</script>

<style>
	.addnewaddress-text {
		height: 566px;
	}

	.addnewaddress-text div {
		height: 40px;
		line-height: 40px;
		margin-top: 20px;
		margin-left: 3%;
	}

	.addnewaddress-text div span {
		float: left;
		width: 135px;
		text-align: right;
	}

	.addnewaddress-text div input {
		float: left;
		outline: none;
	}

	.shouhuoname {
		width: 47%;
		height: 32px;
		border: 1px solid #c1c1c1;
	}

	.addnewaddress-text select {
		width: 15%;
		height: 32px;
		margin-right: 1%;
	}

	.adderphone {
		width: 16%;
	}

	.gudingphone1 {
		width: 5%;
	}

	.addnewaddress-text div .and {
		width: 20px;
	}

	.gudingphone2 {
		width: 10%;
	}

	.radioipt {
		margin-top: 10px;
		margin-left: 15%;
		width: 20px;
		height: 20px;
	}

	.addnewaddress-text .addernewsub {
		width: 148px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		color: white;
		background: #f08200;
		margin-left: 17%;
		border-radius: 5px;
		cursor: pointer;
	}

	.addnewaddress-text .suozaiaddress select {
		padding: 0px;
		outline: none;
		border-radius: 0px;
	}
</style>
